<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta charset="UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
  <title>Demo:LeftMenu</title>
  <link type="text/css" rel="stylesheet" href="../K/K.css"/>
  <script src="../resources/K-dev/js/jquery-2.2.4.min.js"></script>
  <script src="../K/K.js"></script>
  <style>
  #test1{position:fixed;left:100px;top:100px;width:200px;height:500px;border:1px solid red;}
  #test2{position:fixed;left:500px;top:300px;width:160px;height:270px;border:1px solid green;}
  </style>
  <script>
  
  $(function(){
	  
	  K.Tool.install().done(function(){
		  /*
		  //menu1 ajax data
		    var menu1=new K.LeftMenu.View();
		    menu1.setURL({"leftMenu":"json/leftmenu.json"});
		    menu1.to($("#test1"));
		  */
		    var menu=(new K.LeftMenu.View());
			var json={
					"data":[{"id":"23","text":"AAA","icon":"menu-icon-dai_ban",
							 "children":[{"id":"11","text":"qerr",
					                       "children":[
                                        				{"id":"113","text":"xxx"},
                                        				{"id":"114","text":"ccc"}
                                        			  ]},
                                         {"id":"12","text":"wwww"}
                                        ]},
					        {"id":"23","text":"BBB","icon":"menu-icon-dai_ban"}
					        ]
			};
			menu.setData(json).to($("#test2")).click(function($leaf){
				alert($leaf.attr("data-id")+": "+$.trim($leaf.text()));
			});
	  });
  });
  </script>
</head>
<body class="default">
	<div id="test1"></div>
	<div id="test2"></div>
	<div id="menu"></div>
</body>
</html>
